Міністерство освіти і науки України Національний університет «Львівська політехніка» Кафедра ЕОМ / Лабораторна робота №5 з предмету: «Глобальні інформаційні мережі» на тему: «Онлайнові картографічні сервіси» Львів – 2014 Мета роботи: Ознайомитися з бібліотеками jQuery та jQuery UI та реалізованими прикладами. У відкритих джерелах знайти віджети, розмістити на своїй сторінці і при можливості редагувати. Порядок роботи: Ознайомитися з наведеними ресурсами. Ознайомитися з картами GoogleMaps, Яндекс карти, та реалізованими прикладами. Висновок. Хід роботи: Ознайомлення з картами Яндекс / Ознайомлення з картами Google / Встановлення Карти яндекс на сайт / Вставка Google карти на сайт / Код створення карт <script type="text/javascript"> var myMap; ymaps.ready(init); // Ожидание загрузки API с сервера Яндекса function init () { var myMap = new ymaps.Map('map', { // При инициализации карты, обязательно нужно указать // ее центр и коэффициент масштабирования center: [49.85, 24.21], // Нижний Новгород zoom: 10 }); // Создание метки var myPlacemark = new ymaps.Placemark( // Координаты метки [49.8352, 24.0087],{ iconContent: 'НУ ЛП Корпус №5' } , { // Опции // Иконка метки будет растягиваться под ее контент preset: 'twirl#blueStretchyIcon' } ); myMap.geoObjects.add(myPlacemark); } </script> <script> function mark(){ var contentString = '<h5>НУ ЛП</h5><IMG BORDER="0" ALIGN="center" width="200px" height="100px" SRC="http://old.lp.edu.ua/fileadmin/Image_Archive/Korpusi_LP/Kor5_IKNI1.gif">'; var infowindow = new google.maps.InfoWindow({ content: contentString }); google.maps.event.addListener(marker, 'mouseover', function() { infowindow.open(map,marker); }); google.maps.event.addListener(marker, 'mouseout', function() { infowindow.close(map,marker); }); } var map; var marker; function initialize() { var mapCanvas = document.getElementById('map_canvas'); var mapOptions = { center: new google.maps.LatLng(49.85, 24.21), zoom: 10, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(mapCanvas, mapOptions) marker = new google.maps.Marker({ position: new google.maps.LatLng(49.8352, 24.0087), map: map, title: 'НУ ЛП Корпус №5' }); mark(); }; google.maps.event.addDomListener(window, 'load', initialize); </script> Висновок: На цій лабораторні роботі я ознайомився із Яндекс та Google картами.